﻿@{
    ViewBag.Title = "GetXmlData";
    Layout = "~/Views/Shared/_Page.cshtml";
}

<style type="text/css">
	#ajaxStatusMessage {
        border:3px double green;
        width: 300px;
        background-color: lightcyan;
        color: #008000;
	}

	#tblEmployee {
        border:0px;
        color: #008000;
	}

	#tblEmployee td {
        padding-right: 10px;
        padding-left: 10px;
	}

	.header {
        font-weight: bold;
        background-color: lightgray;
	}

	.evenRow {
        background-color: lightyellow;
	}
          
	.oddRow {
        background-color: lightblue;
	}

	.errMsg {
        background-color: orange;
        color: white;
        font-weight: bold;
        width: 600px;
	}
</style>

<h2>Get Xml Data</h2>

<input type="button" id="btnSubmit" value="submit" />

<table id="tblEmployee"></table><br>
    
<div id="ajaxStatusMessage"></div>

<script type="text/javascript">
    function processData(returnedData, status) {
        $("#ajaxStatusMessage").append("Status: " + status + "<br>");

        ZEUS.DEBUG.log(returnedData);

        $("#tblEmployee").append("<tr><td>Name</td><td>Age</td><td>Title</td>");

        $(returnedData).find('Employee').each(function () {
            $("#tblEmployee").append(
                 "<tr><td>" + $(this).find("Name").text() +
                 "</td><td>" + $(this).find("Age").text() +
                 "</td><td>" + $(this).find("Title").text() + "</td></tr>");

        });

        $("tr").eq(0).addClass("header");
        $("tr:even:gt(0)").addClass("evenRow");
        $("tr:odd").addClass("oddRow");
    }

    function reportError(request, status, errorMsg) {
        $("#ajaxStatusMessage").append("Status: " + status + "<br>Error Message: " + errorMsg);
        $("#ajaxStatusMessage").addClass("errMsg");
    }

    $(document).ready(function () {
        $('#btnSubmit').click(function () {
            $.ajax({
                type: "POST",
                url: "/Employee/GetXmlData",
                dataType: "xml",
                success: processData,
                error: reportError
            });
        });
    });
</script>
